<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>websocket测试</title>		
	</head>
	<body>
		<button type="button" id="btn" >按钮</button>
		<input type="text" name="" id="demo" value="" />
		<div id="res">接收到的服务器端消息显示区域</div>
	</body>
</html>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript"> 
	// 打开一个 web socket，设定websocket服务器地址和端口
	var ws = new WebSocket("ws://127.0.0.1:3008");

	//开启连接open后客户端处理方法
	ws.onopen = function()
	{
	  // Web Socket 已连接上，在页面中显示消息
	  document.getElementById('res').innerHTML="当前客户端已经连接到websocket服务器";
	   
	};
	// 点击按钮时给websocket服务器端发送消息
	$('#btn').click(function(){
		var value = $('#demo').val();
		ws.send(value);
	})
	// 接收消息后客户端处理方法
	ws.onmessage = function (evt) 
	{ 
	  console.log(evt.data,'接收到了数据，并作出响应');
	  $('#res').text(evt.data);
	};
	
	// 关闭websocket
	ws.onclose = function()
	{ 
	  // 关闭 websocket
	  alert("连接已关闭..."); 
	};

</script>